<template>
	<view>
		<!-- <view
			style="background: #ffffff; width: 93%; margin: 0 auto; margin-bottom: 12px; height: 100px; margin-top: 5px; border-radius: 5px; display: flex;justify-content: center;align-items: center;">
			<view style="flex: 1;display: flex; flex-direction: column;">
				<text style=" font-size: 25rpx">{{i18n.balance}}</text>
				<text
					style="color: #0166fc; font-weight: bold; margin-top: 5px; font-size: 50rpx;">{{this.$store.state.users.usdt.toFixed(2)}}</text>
			</view>
		</view> -->


<view class="" style="padding: 20rpx 40rpx;">
	<view class="" style="font-weight: bold;font-size: 32rpx;">
		{{$t('other.jkje')}}
	</view>
	<view class="" style="margin: 30rpx 0;font-size:60rpx;display: flex;justify-content: center;align-items: center;">
		{{ money }}
	</view>
			<vue-slider
	                v-model="money"
	                :data="data0"
	                :marks="marks0"
	                
	            ></vue-slider>
				<view class="" style="margin-top:60rpx;font-weight: bold;font-size: 32rpx;">
						{{$t('other.tianshu')}}
				</view>
				<view class="" style="margin: 30rpx 0;font-size:60rpx;display: flex;justify-content: center;align-items: center;">
					{{days1}}
				</view>
				 <vue-slider
					  :hide-label="true"
					   :tooltip="'none'"
						v-model="days"
						:data="data"
						:marks="marks"
						
						@change="changes"
					></vue-slider>
					<view style="display: flex;justify-content: space-between;align-items: center;">
		
					  <view @click="days=0,days1=7">7</view>
					  <view  @click="days=15,days1=15">15</view>
					  <view  @click="days=30,days1=30">30</view>
					</view>
					<view class="" style="margin-top:60rpx;">
							{{$t('other.dbr')}}
					</view>
					<view class="" style="margin-top: 30rpx;">
						<input type="text" v-model="dbr_uid" :placeholder="$t('other.dbruid')" style="border: 1rpx solid #eee;width: 100%;border-radius: 10rpx;padding: 10rpx;"/>
					</view>
				<view class="" style="display: flex;align-items: center;justify-content: center;padding: 0 20rpx;margin-top: 60rpx;">
					
					<view class="" style="background-color: #0166FC;color: #fff;border-radius: 50rpx;width: 100%;text-align: center;padding: 30rpx;" @click="primarySubmit">
						{{$t('other.sq')}}
					</view>
				</view>
</view>
	
	</view>
</template>

<script>
	import VueSlider from 'vue-slider-component'  
	import 'vue-slider-component/theme/default.css' 
	export default {
		  components: {  
		    VueSlider  
		  }, 
		data() {
			return {
				value:50,
				indexList: [],
				yhindexList: [],
				days1:7,
				dbr_uid:'',
				money:100000,
				days:0,
				distance: {
					ticks: [0, 1, 2, 3],
					ticks_labels: ['2 km', '5 km', '10 km', '25 km'],
					value: 1
				},
				sliderValue:50,
				form: {
				  type: {},
				  name: '',
				  number: ''
				},
			   cardTypeList: [
				  { text: this.$t('PrimaryCertification.ID card'), value: 0 },
				  { text: this.$t('PrimaryCertification.passport'), value: 1 },
				  { text: this.$t('PrimaryCertification.driver license'), value: 2 }
				],
				showPicker: false,
				loading: false,
				isDayTime: false,
				isDisabled: false,
			}
		},
		onLoad() {
			// this.getData()
			const _this = this
			uni.setNavigationBarTitle({
				title: _this.$t("other.jiedai")
			})
			if (this.$store.state.bgColor == 'black') {
				uni.setNavigationBarColor({
					frontColor: '#ffffff', // 导航栏标题颜色，只能是'black'或'white'
					backgroundColor: '#22252F'
				});
			}
			this.$nextTick(() => {
			
				let systemInfo = uni.getSystemInfoSync();
				this.scrollH = systemInfo.windowHeight - 100
			
				document.querySelectorAll('.uni-page-head .uni-page-head-ft .uni-page-head-btn')[0].querySelector(
					'.uni-btn-icon').innerText = this.$t("other.jiedaiRecord");
			})
		},
		onNavigationBarButtonTap() {
			uni.navigateTo({
				url: "/pages/users/jiedai/jiedaiRecord"
			})
		},
		  computed: {
				  i18n() {
					return this.$t("other")
				  },
		        points0: function () {
		          return [
		            {
		              value: 100000,
		              step: 10000,
		            },
		            // {
		            //   value: 500000,
		            //   step: 10000,
		            // },
		            {
		              value: 1000000,
		              step: 10000,
		            },
		          ];
		        },
		        data0: function () {
		          let result = [];
		
		          this.points0.forEach((point, idx) => {
		            const lastPointValue = this.points0[this.points0.length - 1].value;
		
		            if (point.value === lastPointValue) {
		              return;
		            } else {
		              const nextPoint = this.points0[idx + 1];
		
		              for (let i = point.value; i <= nextPoint.value; i += point.step) {
		                result.push(i);
		              }
		            }
		          });
		
		          const uniqueValues = new Set(result);
		          return [...uniqueValues];
		        },
		        marks0: function () {
		          return this.points0.map(point => point.value);
		        },
		        points: function () {
		          return [
		            {
		              value: 0,
		              step: 1,
		            },
		            {
		              value: 30,
		              step: 1,
		            },
		          ];
		        },
		        data: function () {
		          let result = [];
		
		          this.points.forEach((point, idx) => {
		            const lastPointValue = this.points[this.points.length - 1].value;
		
		            if (point.value === lastPointValue) {
		              return;
		            } else {
		              const nextPoint = this.points[idx + 1];
		
		              for (let i = point.value; i <= nextPoint.value; i += point.step) {
		                result.push(i);
		              }
		            }
		          });
		
		          const uniqueValues = new Set(result);
		          return [...uniqueValues];
		        },
		        marks: function () {
		          return this.points.map(point => point.value);
		        },
		      themeClass() {
		        return this.isDayTime ? '' : 'darknight'
		      }
		    },
		methods: {
			 primarySubmit() {
			      
			      
			        if (this.dbr_uid.trim() == '') {
			          uni.$u.toast(this.$t('other.qsrdbruid'))
			          return
			        }
					// this.loading = true
					// this.disableds = true
			        let params = {
			          days:this.days1,
			          dbr_uid: this.dbr_uid,
			          money: this.money,
			        }
			       this.$H.post('/api/v1/jiedai_submit', false,params).then(res => {
			       	this.loading = false
			       	this.disableds = false
			       	if (res.type == "ok") {
			       		uni.$u.toast(res.message);
			       		 // this.$router.push('/jiedai_record')
						 uni.navigateTo({
						 	url: "/pages/users/jiedai/jiedaiRecord"
						 })
			       	}else{
						uni.$u.toast(res.message);
					}
			       })
			      },
			changes(e){
			        // console.log(e,'变化了---')
					// else if(e<5){
					// 					      this.days1=8
					// }else if(e<7){
					// 					      this.days1=8
					// }else if(e==7){
					// 					      this.days1=8
					// }
			       if(e==0||e<=7){
			        this.days1=7
			       }else{
			        this.days1=e
			       }
			      },
			        navigate(){
			            console.log('记录')
			            this.$router.push('/jiedai_record')
			        },
			getData() {


				var arr = []
				const res = this.$H.get('/api/v1/usdtInfo', false).then(res => {
					// this.loading=false
					if (res.type == "ok") {




						var arr = []



						res.data.map(item => {



							// let date = new Date(Date.parse(new Date(item.create_time)))
							// item.create_time = this.$u.test.formatDate(date, 'yyyy-MM-dd hh:mm')


							arr.push(item)



						})
						this.indexList = arr


					} else {

					}
				})

				var arryh = []
				const resyh = this.$H.get('/api/v1/cashInfo', false).then(res => {
					// this.loading=false
					if (res.type == "ok") {




						var arryh = []



						res.data.map(item => {




							arryh.push(item)



						})
						this.yhindexList = arryh


					} else {

					}
				})
			},
			godigital() {
				uni.navigateTo({
					url: "/pages/users/digital/digital"
				})
			},
			gobanks() {
				uni.navigateTo({
					url: "/pages/users/banks/banks"
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #F7F8FA;
	}
</style>